<template>
  <div class="about">
    <h1>This is an about page</h1>
    <h1>{{type}}:{{count}}</h1>
    <!-- <h2>{{ccc}}</h2> -->
    <button @click='add'>+</button>
    <button @click='minus'>-</button>
  </div>
</template>
<script>
import {mapState,mapGetters,mapMutations,mapActions} from 'vuex'
export default {
  data(){
    return {
      name:"zhunfe"
    }
  },
  created() {
    console.log(this)
  },
  methods: {
    add(){
      this.changeCount(10)
      // this.$store.commit('changeCount',10)
    },
    minus(){
      this.changeCountAsync(-5)
      // this.$store.commit('changeCount',-5)
      // this.$store.dispatch("changeCountAsync",-5)
    },
    ...mapMutations(['changeCount']),
    ...mapActions(['changeCountAsync'])
  },
  computed: {
    // count(){
    //   return this.$store.state.count
    // }
    ...mapState(['count']),
    ...mapGetters(['type'])
  },
}
</script>
